<script type="text/javascript" language="javascript">
    (function($) {
        /*whatever jQuery stuff*/
        $(function(){
            jQuery.validator.addMethod("video_recommend_required", function(value, element, param) {
                var returnVal = true;
	            $('ul[class*="video_id_"]').each(function(){
	       			if($(this).find("li").length == 1) returnVal = false
	       		});
				return returnVal;
           	}, jQuery.validator.messages.video_recommend_required);
           	        					
            $("#Form").validate({
				ignore: "",
                rules: {
					"video_recommend_checked": {
						video_recommend_required:true
					}
                },
                showErrors: function(errorMap, errorList){
                    var messages='';
                    for (var i = 0; i < errorList.length; i++) {
                        messages += '- '+errorList[i].message+'\n';
                    }
                    if(messages) alert("<?php echo lang('requirement');?>: \n"+"¯¯¯¯¯¯¯¯¯¯ \n"+ messages);
                    //this.defaultShowErrors();
                } ,
                submitHandler: function(e){
					$('.ajax-loading',e).css('visibility','visible');
					//Send Form
					document.forms["Form"].submit();
                },
                onfocusout: false,
                onkeyup: false,
				onclick: false,					
                messages: {
					"video_recommend_checked": {
						video_recommend_required : "<?php echo lang('video_recommend_not_empty');?>"
					}																				
                }
            });
               
			//ColorBox Iframe
			$('.search_tools').colorbox({
				onLoad:function(){ colorbox_element = $(this); },
				onClosed:function(){ colorbox_element = "";},
				iframe:true, 
				innerWidth:300, 
				innerHeight:600, 
				right:0, 
				opacity:0.4
			});                   
        });
    })(jQuery);
 
var colorbox_element='';      
/*Add/Remove List*/
function addRemoveList(unique,id,name)
{
	if(id == undefined && name == undefined){ //remove List
		var parentElement = $(unique).closest('ul');
		$(unique).parent().remove();
		if($('li:not(:hidden)',parentElement).length < 1){
			parentElement.find('.first').show();
		}	
	} else { //add List
		var parentElement = $(colorbox_element).next();
		var slot = ($(colorbox_element).next().attr('class').match(/video_id_[0-9]/g));
		parentElement.find('.first').hide();
		if($('input[value="'+id+'"]',parentElement).length == 0){
			parentElement.prepend('<li>&rarr;&nbsp;'+id+' - '+name+' <a href="javascript:void(0)" class="tools minus" onclick="javascript:addRemoveList(this);"></a><input type="hidden" name="'+slot+'[]" value="'+id+'" \/><\/li>');
		}		
	}
}    
</script>
<div class="wrap">
 	<div id="icon-index" class="icon32"><br /></div><h2><?php echo ucwords(str_replace('_',' ',$this->uri->segment(1)));?> &raquo; <?php echo ucwords(str_replace('_',' ',$this->uri->segment(2)));?></h2>
</div>
<div id="wpbody-content">
    <div class="metabox-holder" id="dashboard-widgets">	
            <div class="inside">			
				<form id="Form" method="post" action="" name="Form">
					<table border="0" cellspacing="0" cellpadding="0" class="form-table">
						<tbody>	
						<tr>
							<th scope="row"><?php echo lang('video_recommend');?></th>
							<td>
								<?php for($i=1;$i <= 5;$i++):?>
								<div style="padding:3px 0;">
									<strong><?php echo lang('video_recommend_slot_'.$i);?></strong>
									<a href="<?php echo base_url().'video/content_management/search_video';?>" class="tools plus search_tools"></a>
									<ul class="video_id_<?php echo $i;?> listItems">
										<?php if(!empty($dataResult)) foreach($dataResult[intval($i-1)] as $value):?>
											<li>
												<?php echo '&rarr;&nbsp;'.$value->video_id.' - '.$value->video_name;?>
												<a href="javascript:void(0)" class="tools minus" onclick="javascript:addRemoveList(this);"></a>
												<input type="hidden" name="video_id_<?php echo $i;?>[]" value="<?php echo $value->video_id;?>" />
											</li>
										<?php endforeach;?>									
										<li class="first" style="display:none;"><?php echo lang('select_option');?></li>
									</ul>
								</div>
								<?php endfor;?>
								<input type="hidden" name="video_recommend_checked" value="1" \/>
							</td>
						</tr>														
						<tr>
							<th scope="row">&nbsp;</th>
							<td><p class="submit"><input type="submit" value="<?php echo lang('button_update');?>" class="button-primary" />&nbsp;<img alt="" class="ajax-loading" src="<?php echo css_asset_url('images/wpspin_light.gif'); ?>" /></p></td>
						</tr>								
						</tbody>
					</table>
					<div class="tablenav bottom"></div>
				</form>
            </div><!-- wpbody inside -->
    </div><!-- wpcontent -->
</div><!-- wpbody-content -->